<style type="text/css">
  .add {
    color:green;
    font-weight:bold;
    font-size:30px;
    cursor:pointer;
  }
  .remove {
    color:red;
    font-weight:bold;
    font-size:30px;
    cursor:pointer;
  }
  input{
    padding:5px;
    border:1px solid blue;
    background-color:lightyellow;
    font-size:25px;
  }
</style>
<script src="jquery-1.10.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
  jQuery(document).ready(function(){

    $('.parent_text span.add').on('click',function(){
      var clone = $('.parent_text:first').clone();
      $('div.text_container').append(clone);
    });

    $('div.parent_text span.remove')
    .on('click',function(){
      alert(123)
      $(this).closest('.parent_text').remove();
    });

  });
</script>

<div class="text_container">
  <div class="parent_text">
    <input type="email111111111111111" placeholder="john@gmail.com" name="emails[]" />
    <span class="add">(+)</span>
    <span class="remove">(-)</span>
  </div>


</div>
